﻿@using thousandClear.Areas.Admin.Models;

@model OrderDetailModel

@{
    ViewBag.Title = "订单详情";
    Layout = "~/Areas/Admin/Views/Shared/_Admin.cshtml";
}

<div id="app">
    <div class="am-cf am-padding">
        <div class="am-fl am-cf"><strong class="am-text-primary am-text-lg">后台管理</strong> / <small>@ViewBag.Title</small></div>
    </div>
    <div class="am-tabs am-margin" data-am-tabs="{noSwipe: 1}" id="doc-tab-demo-1">
        <ul class="am-tabs-nav am-nav am-nav-tabs">
            <li class="am-active"><a href="javascript: void(0)">基本信息</a></li>
            <li><a href="javascript: void(0)">收货信息</a></li>
            <li><a href="javascript: void(0)">商品信息</a></li>
            @*<li><a href="javascript: void(0)">下单信息</a></li>*@
            @*<li><a href="javascript: void(0)">支付信息</a></li>*@
            @*<li><a href="javascript: void(0)">退款信息</a></li>*@
        </ul>
        <div class="am-tabs-bd">
            <div class="am-tab-panel am-active">
                <table class="am-table am-table-bordered am-table-striped am-table-hover">
                    <tbody>
                        <tr>
                            <td width="10%" class="am-primary">订单Id</td>
                            <td>@Model.Id</td>
                        </tr>
                        <tr>
                            <td width="10%" class="am-primary">下单人</td>
                            <td>@Model.OrderPerson</td>
                        </tr>
                        <tr>
                            <td width="10%" class="am-primary">订单号</td>
                            <td>@Model.SerialNo</td>
                        </tr>
                        <tr>
                            <td width="10%" class="am-primary">商品积分</td>
                            <td>@Model.Amount 积分</td>
                        </tr>
                        @*<tr>
                                <td width="10%" class="am-primary">运费金额</td>
                                <td>￥@Model.PostFee 元</td>
                            </tr>
                            <tr>
                                <td width="10%" class="am-primary">商品重量</td>
                                <td>@Model.Weight KG</td>
                            </tr>*@
                        <tr>
                            <td width="10%" class="am-primary">订单状态</td>
                            @if (Model.Status == 0)
                            {
                                <td>已兑换</td>
                            }
                            else if (Model.Status == 1)
                            {
                                <td>等待发货</td>

                            }
                           else if (Model.Status == 2)
                                {
                                    <td>已发货</td>

                            }
                            @* else if (Model.Status == 3)
                                {
                                    <td>已完成</td>

                                }
                                else if (Model.Status == 4)
                                {
                                    <td>已取消</td>

                                }*@
                        </tr>
                    </tbody>
                </table>
            </div>
            <div class="am-tab-panel">
                <table class="am-table am-table-bordered am-table-striped am-table-hover">
                    <tbody>
                        <tr>
                            <td width="10%" class="am-primary">收货人</td>
                            <td>@Model.ReceivePerson</td>
                        </tr>
                        <tr>
                            <td width="10%" class="am-primary">收货人电话</td>
                            <td>@Model.ReceiveMobile</td>
                        </tr>
                        <tr>
                            <td width="10%" class="am-primary">收货地址</td>
                            <td>@Model.ReceiveAddress</td>
                        </tr>
                        <tr>
                            <td width="10%" class="am-primary">邮政编码</td>
                            <td>@Model.ReceiveZipCode</td>
                        </tr>
                        @*<tr>
                                <td width="10%" class="am-primary">商品重量</td>
                                <td>@Model.Weight KG</td>
                            </tr>*@
                        @*<tr>
                                <td width="10%" class="am-primary">运费</td>
                                <td>￥@Model.PostFee 元</td>
                            </tr>*@
                        <tr>
                            <td width="10%" class="am-primary">运单号</td>
                            <td>
                                @if (Model.Status == 1)
                                {
                                    <form class="am-form-inline" onsubmit="return false;">
                                        <div class="am-form-group">
                                            <input type="text" class="am-form-field" placeholder="输入运单号" v-model="postBillNo">
                                        </div>
                                        <button class="am-btn am-btn-primary" v-on:click="deliver">发货</button>
                                    </form>

                                    <form id="formDeliver" action="../deliver" method="post">
                                        <input type="hidden" name="postBillNo" v-model="postBillNo" />
                                        <input type="hidden" name="orderId" v-model="orderId" />
                                    </form>
                                }
                                else if (Model.Status == 2)
                                {
                                    <span>@Model.PostBillNo</span>
                                }
                                else
                                {
                                    <span>N/A</span>
                                }
                            </td>
                        </tr>
                        <tr>
                            <td width="10%" class="am-primary">备注</td>
                            <td>@Model.Remark</td>
                        </tr>
                    </tbody>
                </table>
            </div>
            <div class="am-tab-panel">
                <table class="am-table am-table-bordered am-table-striped am-table-hover">
                    <thead>
                        <tr>
                            <th>商品图片</th>
                            <th>商品名称</th>
                            <th>商品积分</th>
                            <th>兑换数量</th>
                            @*<th>商品重量</th>*@
                        </tr>
                    </thead>
                    <tbody>
                        @foreach (OrderGoodModel item in Model.Goods)
                        {
                            <tr>
                                <td width="170px">
                                    <span>
                                        <img width="160px" height="80px" src="@item.ImgUrl" />
                                    </span>
                                </td>
                                <td>@item.Name</td>
                                <td>@item.Amount 积分</td>
                                <td>x @item.Quantity</td>
                            </tr>
                        }
                    </tbody>
                </table>
            </div>
            <div class="am-tab-panel">
                <table class="am-table am-table-bordered am-table-striped am-table-hover">
                    <tbody>
                        <tr>
                            <td width="10%" class="am-primary">下单人</td>
                            <td>@Model.OrderPerson</td>
                        </tr>
                        <tr>
                            <td width="10%" class="am-primary">下单手机号</td>
                            <td>@Model.OrderMobile</td>
                        </tr>
                        <tr>
                            <td width="10%" class="am-primary">下单时间</td>
                            <td>@Model.OrderTime</td>
                        </tr>
                    </tbody>
                </table>
            </div>
            <div class="am-tab-panel">
                <table class="am-table am-table-bordered am-table-striped am-table-hover">
                    <tbody>
                        <tr>
                            <td width="10%" class="am-primary">系统支付单号</td>
                            <td>@Model.PayTradeNo</td>
                        </tr>
                        <tr>
                            <td width="10%" class="am-primary">微信支付单号</td>
                            <td>@Model.PayTranId</td>
                        </tr>
                        <tr>
                            <td width="10%" class="am-primary">支付方式</td>
                            @if (Model.PayMode == 1)
                            {
                                <td>微信支付</td>
                            }
                            else
                            {
                                <td>其他支付方式</td>

                            }
                        </tr>
                        <tr>
                            <td width="10%" class="am-primary">支付状态</td>
                            @if (Model.PayState == 1)
                            {
                                <td>已支付</td>
                            }
                            else
                            {
                                <td>未支付</td>

                            }
                        </tr>
                        <tr>
                            <td width="10%" class="am-primary">支付时间</td>
                            <td>@Model.PayTime</td>
                        </tr>
                    </tbody>
                </table>
            </div>
            <div class="am-tab-panel">
                <table class="am-table am-table-bordered am-table-striped am-table-hover">
                    <tbody>
                        <tr>
                            <td width="10%" class="am-primary">系统退款单号</td>
                            <td>@Model.RefundTradeNo</td>
                        </tr>
                        <tr>
                            <td width="10%" class="am-primary">微信退款单号</td>
                            <td>@Model.RefundTranId</td>
                        </tr>
                        <tr>
                            <td width="10%" class="am-primary">退款方式</td>
                            @if (Model.RefundMode == 1)
                            {
                                <td>微信退款</td>
                            }
                            else
                            {
                                <td>N/A</td>

                            }
                        </tr>
                        <tr>
                            <td width="10%" class="am-primary">退款状态</td>
                            @if (Model.RefundState == 1)
                            {
                                <td>已退款</td>
                            }
                            else
                            {
                                <td>未退款</td>

                            }
                        </tr>
                        <tr>
                            <td width="10%" class="am-primary">退款时间</td>
                            <td>@Model.RefundTime</td>
                        </tr>
                        <tr>
                            <td width="10%" class="am-primary">退款金额</td>
                            <td>
                                @if (Model.RefundState == 0 && Model.Status != 4)
                                {
                                    <form class="am-form-inline" onsubmit="return false;">
                                        <div class="am-form-group">
                                            <input type="tel" class="am-form-field" placeholder="输入退款金额(单位:分)" v-model="refundFee"> 分
                                        </div>
                                        <button class="am-btn am-btn-primary" v-on:click="refund">退款</button>
                                    </form>

                                    <form id="formRefund" action="../refund" method="post">
                                        <input type="hidden" name="refundFee" v-model="refundFee" />
                                        <input type="hidden" name="orderId" v-model="orderId" />
                                    </form>
                                }
                                else
                                {
                                    <span>￥@Model.RefundFee 元</span>
                                }
                            </td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
    @if (!ViewBag.Success)
    {
        <div class="am-alert am-alert-danger am-margin">
            @ViewBag.ErrMsg
        </div>
    }
    <br />
    <button class="am-btn am-margin am-btn-danger" v-on:click="back">返回</button>
</div>

@section Scripts{
    <script>
        var model = new Vue({
            el: '#app',
            data: {
                postBillNo: '',
                orderId: @Model.Id,
                refundFee: 0,
            },
            methods: {
                back:function(){
                    window.location.href = "../../ShopOrderList";
                },
                deliver: function () {
                    var self = this;

                    if (self.postBillNo == '')
                    {
                        alert("请输入运单号");
                        return;
                    }

                    var cfm = confirm("确认发货吗?");


                    if(cfm)
                    {
                        $('#formDeliver').submit();
                    }
                },
                refund: function(){
                    var self = this;

                    if(self.refundFee <= 0)
                    {
                        alert("请输入退款金额");
                        return;
                    }

                    var cfm = confirm("确认退款吗？")

                    if(cfm)
                    {
                        $('#formRefund').submit();
                    }
                }
            }
        });

        $('.admin-sidebar-order').addClass('current')
    </script>
}

